<template>
	<view class="indexMain">
		<view class="indexBox">
			<!-- banner -->
			<!-- <view class="indexBannerMain">
        <view class="indexBannerBox">
          <u-swiper
            :list="bannerList"
            height="365"
            :border-radius="0"
          ></u-swiper>
        </view>
      </view> -->
			<!-- 收益统计 -->
			<view class="indexIncomeMain">
				<view class="headerBtnBox flex align-center">
					<view class="titleContet flex align-center">
						<text>盛秘书</text>
						<text>您的贴身小管家</text>
					</view>
					<view class="imageBox">
						<image src="../../static/images/icon_cs.png" mode="widthFix" @click="serviceContentTap"></image>
						<image src="../../static/images/icon_news.png" mode="widthFix"
							@click="$u.route('/pages/notice/list')"></image>
					</view>
				</view>
				<view class="indexIncomeBox">
					<view class="top">
						<view class="left">
							<text>累计收益 (元)</text>
							<text>{{
                incomeData.total_income ? $tools.format(incomeData.total_income) : "0.00"
              }}</text>
						</view>
						<view class="right flex align-center" @click="jumpTap('/pages/indexData/indexData')">
							收益中心<image src="../../static/images/btn_right.png" mode="widthFix"></image>
						</view>
					</view>
					<view class="sub flex align-center justify-around">
						<view class="item">
							<text>今日收益 (元)</text>
							<text>{{
                incomeData.today_income ? $tools.format(incomeData.today_income) : "0.00"
              }}</text>
						</view>
						<view class="item">
							<text>本月收益 (元)</text>
							<text>{{
                incomeData.month_income ? $tools.format(incomeData.month_income) : "0.00"
              }}</text>
						</view>
					</view>
				</view>
			</view>
			<!-- indexMenu -->
			<view class="indexMenuMain">
				<view class="indexMenuBox clearfix">
					<view class="indexMenuItem" @click="jumpTap('/pages/zcSetting/zcSetting')">
						<image src="../../static/images/menu/zcszIcon.png" mode="widthFix"></image>
						<view class="tip">代理</view>
						<text>政策设置</text>
					</view>
					<view class="indexMenuItem" @click="$u.route('/pages/terminalzcModify/index')">
						<image src="../../static/images/menu/bzzy.png" mode="widthFix"></image>
						<view class="tip">机具</view>
						<text>政策设置</text>
					</view>
					<view class="indexMenuItem" @click="jumpTap('/pages/myMerchant/myMerchant')">
						<image src="../../static/images/menu/wdshIcon.png" mode="widthFix"></image>
						<text>我的商户</text>
					</view>
					<view class="indexMenuItem" @click="jumpTap('/pages/myTeam/myTeam')">
						<image src="../../static/images/menu/wdtdIcon.png" mode="widthFix"></image>
						<text>我的团队</text>
					</view>
					<view class="indexMenuItem" @click="jumpTap('/pages/tradeManage/index')">
						<image src="../../static/images/menu/wdjy.png" mode="widthFix"></image>
						<text>交易管理</text>
					</view>
					<view class="indexMenuItem" @click="jumpTap('/pages/inventoryManagement/index')">
						<image src="../../static/images/menu/kcglIcon.png" mode="widthFix"></image>
						<text>终端管理</text>
					</view>

					<view class="indexMenuItem" @click="jumpTap('/pages/jjhb/index')">
						<image src="../../static/images/menu/jjhbIcon.png" mode="widthFix"></image>
						<text>机具调拨</text>
					</view>
					<view class="indexMenuItem" @click="jumpTap('/pages/share/share')">
						<image src="../../static/images/menu/fzdlIcon.png" mode="widthFix"></image>
						<text>发展代理</text>
					</view>
				</view>
			</view>
		</view>
		<!-- 数据统计 -->
		<view class="dataPart">
			<view class="dataBox">
				<view class="topText">
					<image src="../../static/images/icon_db.png" mode="widthFix"></image>
					<text>交易数据</text>
				</view>
				<view class="chooseItem">
					<view :class="dataShowOne == 1?'':'unActive'" @click="dataOneChange(1)">自营交易</view>
					<view :class="dataShowOne == 2?'':'unActive'" @click="dataOneChange(2)">团队交易</view>
				</view>
				<view class="dataShow" v-if="dataShowOne == 1">
					<view class="flex align-center">
						<view>今日交易 (元)</view>
						<view>{{userStat.day_trade != '0'&& userStat.day_trade != null ? $tools.format(userStat.day_trade) : "0.00" }}</view>
					</view>
					<view class="flex align-center">
						<view>本月交易 (元)</view>
						<view>{{groupStat.month_trade!= '0'&&groupStat.month_trade != null ? $tools.format(groupStat.month_trade) : "0.00"}}</view>
					</view>
				</view>
				<view class="dataShow" v-if="dataShowOne == 2">
					<view class="flex align-center">
						<view>今日交易 (元)</view>
						<view>{{ groupStat.day_trade!= '0'&&groupStat.day_trade != null ? $tools.format(groupStat.day_trade) : "0.00"}}</view>
					</view>
					<view class="flex align-center">
						<view>本月交易 (元)</view>
						<view>{{userStat.month_trade!= '0'&& userStat.month_trade != null ? $tools.format(userStat.month_trade) : "0.00"}}</view>
					</view>
				</view>
				<view class="totleData flex align-center" v-if="dataShowOne == 1">
					累计交易 (元) ：
					<text>{{userStat.total_trade!== '0'&& userStat.total_trade != null ? $tools.format(userStat.total_trade ): "0.00"}}</text>
				</view>
				<view class="totleData flex align-center" v-if="dataShowOne == 2">
					累计交易 (元) ：
					<text>{{groupStat.total_trade!== '0'&& groupStat.total_trade != null ? $tools.format(groupStat.total_trade) : "0.00"}}</text>
				</view>
			</view>
		</view>


		<view class="dataPart">
			<view class="dataBox">
				<view class="topText">
					<image src="../../static/images/icon_db.png" mode="widthFix"></image>
					<text>激活数据</text>
				</view>
				<view class="chooseItem">
					<view :class="dataShowTwo == 1?'':'unActive'" @click="dataTwoChange(1)">自营激活</view>
					<view :class="dataShowTwo == 2?'':'unActive'" @click="dataTwoChange(2)">团队激活</view>
				</view>
				<view class="dataShow" v-if="dataShowTwo == 1">
					<view class="flex align-center">
						<view>今日激活 (台)</view>
						<view>{{ userActiveStar.todayActive
                      ? $tools.format(userActiveStar.todayActive)
                      : "0" }}</view>
					</view>
					<view class="flex align-center">
						<view>本月激活 (台)</view>
						<view>{{ userActiveStar.monthActive
                      ? $tools.format(userActiveStar.monthActive)
                      : "0"}}</view>
					</view>
					<view class="flex align-center">
						<view>累计激活 (台)</view>
						<view>{{ userActiveStar.totalActive
                      ? $tools.format(userActiveStar.totalActive)
                      : "0"}}</view>
					</view>
				</view>
				<view class="dataShow" v-if="dataShowTwo == 2">
					<view class="flex align-center">
						<view>今日激活 (台)</view>
						<view>{{ groupActiveStar.todayActive
                      ? $tools.format(groupActiveStar.todayActive)
                      : "0"}}</view>
					</view>
					<view class="flex align-center">
						<view>本月激活 (台)</view>
						<view>{{ groupActiveStar.monthActive
                      ? $tools.format(groupActiveStar.monthActive)
                      : "0"}}</view>
					</view>
					<view class="flex align-center">
						<view>累计激活 (台)</view>
						<view>{{ groupActiveStar.totalActive
                      ? $tools.format(groupActiveStar.totalActive)
                      : "0"}}</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 底部菜单 -->
		<u-tabbar :list="tabBarList" :mid-button="false" :active-color="activeColor" :inactive-color="inactiveColor"
			:border-top="borderTop" mid-button-size="76" icon-size="40" height="105rpx"></u-tabbar>
		<u-toast ref="uToast" />
	</view>
</template>
<script>
	export default {
		data() {
			return {
				tabBarList: [],
				borderTop: true,
				inactiveColor: "#909399",
				activeColor: "#fb4535",
				company: "元",
				userInfo: {
					user_type: "",
				},
				incomeData: {
					month_income: 0,
					today_income: 0,
					total_income: 0,
				},

				dataShowOne: 1,
				userStat: {
					day_trade: 0,
					month_trade: 0,
					total_trade: 0,
				},
				groupStat: {
					day_trade: 0,
					month_trade: 0,
					total_trade: 0,
				},

				dataShowTwo: 1,
				userActiveStar: {
					monthActive: 0,
					todayActive: 0,
					totalActive: 0,
				},
				groupActiveStar: {
					monthActive: 0,
					todayActive: 0,
					totalActive: 0,
				},

				tradeCurrent: 0,
				tradeSwiperCurrent: 0,
				activeCurrent: 0,
				activeSwiperCurrent: 0,

			};
		},
		onLoad() {
			this.tabBarList = this.$tabbar.tabbar;
		},
		onShow() {
			this.initUserInfo();
			this.getUserIncome();
			this.getUserStatIndex();
			this.getGroupStatIndex();
			this.getUserActiveStat();
			this.getGroupActiveStat();
		},
		onPullDownRefresh() {
			this.initUserInfo();
			this.getUserIncome();
			this.getUserStatIndex();
			this.getGroupStatIndex();
			this.getUserActiveStat();
			this.getGroupActiveStat();
		},
		methods: {
			// 页面初始化
			initUserInfo() {
				this.$u.api
					.initUserInfo()
					.then((res) => {
						// let month = res.result.month_trade;
						// month = month.replace(/,/g, "");
						// if (month > 10000) {
						//   this.company = "万元";
						// } else {
						//   this.company = "元";
						// }
						// month = month > 10000 ? month / 10000 : month;
						if (res.status == 200) {
							this.userInfo = res.result;
							// this.keepTwoDecimalFull(month);
						}
						uni.stopPullDownRefresh();
					})
					.catch((res) => {
						if (res.errMsg == "request:fail timeout") {
							this.$u.toast("请求超时，请重试!");
						} else if (res.errMsg == "request:fail") {
							this.$u.toast("请求失败，请重试");
						} else {
							this.$u.toast(res.resultDesc);
						}
						this.$loading(false);
						setTimeout(() => {
							this.$u.route({
								type: "navigateBack",
								delta: 1,
							});
						}, 2000);
					});
			},
			//获取个人收益
			getUserIncome() {
				this.$u.api
					.getUserIncome()
					.then((res) => {
						if (res.status == 200) {
							if (res.result) {
								this.incomeData = res.result;
							}
						}
						uni.stopPullDownRefresh();
					})
					.catch((res) => {
						if (res.errMsg == "request:fail timeout") {
							this.$u.toast("请求超时，请重试!");
						} else if (res.errMsg == "request:fail") {
							this.$u.toast("请求失败，请重试");
						} else {
							this.$u.toast(res.resultDesc);
						}
						this.$loading(false);
						setTimeout(() => {
							this.$u.route({
								type: "navigateBack",
								delta: 1,
							});
						}, 2000);
					});
			},

			// 数据板块1切换
			dataOneChange(num) {
				this.dataShowOne = num;
				if (this.dataShowOne == 1) {
					this.getUserStatIndex()
				} else {
					this.getGroupStatIndex()
				}
			},
			//获取自营交易统计数据
			getUserStatIndex() {
				this.$u.api
					.getUserStatIndex()
					.then((res) => {
						if (res.status == 200) {
							this.userStat = res.result;
						}
					})
					.catch((res) => {
						if (res.errMsg == "request:fail timeout") {
							this.$u.toast("请求超时，请重试!");
						} else if (res.errMsg == "request:fail") {
							this.$u.toast("请求失败，请重试");
						} else {
							this.$u.toast(res.resultDesc);
						}
						this.$loading(false);
						setTimeout(() => {
							this.$u.route({
								type: "navigateBack",
								delta: 1,
							});
						}, 2000);
					});
			},
			//获取团队交易统计数据
			getGroupStatIndex() {
				this.$u.api
					.getGroupStatIndex()
					.then((res) => {
						if (res.status == 200) {
							this.groupStat = res.result;
						}
					})
					.catch((res) => {
						if (res.errMsg == "request:fail timeout") {
							this.$u.toast("请求超时，请重试!");
						} else if (res.errMsg == "request:fail") {
							this.$u.toast("请求失败，请重试");
						} else {
							this.$u.toast(res.resultDesc);
						}
						this.$loading(false);
						setTimeout(() => {
							this.$u.route({
								type: "navigateBack",
								delta: 1,
							});
						}, 2000);
					});
			},

			// 数据板块2切换
			dataTwoChange(num) {
				this.dataShowTwo = num;
				if (this.dataShowTwo == 1) {
					this.getUserActiveStat()
				} else {
					this.getGroupActiveStat()
				}
			},

			//获取个人激活统计数据
			getUserActiveStat() {
				this.$u.api
					.getUserActiveStat()
					.then((res) => {
						if (res.status == 200) {
							this.userActiveStar = res.result;
						}
					})
					.catch((res) => {
						if (res.errMsg == "request:fail timeout") {
							this.$u.toast("请求超时，请重试!");
						} else if (res.errMsg == "request:fail") {
							this.$u.toast("请求失败，请重试");
						} else {
							this.$u.toast(res.resultDesc);
						}
						this.$loading(false);
						setTimeout(() => {
							this.$u.route({
								type: "navigateBack",
								delta: 1,
							});
						}, 2000);
					});
			},
			//获取团队激活统计数据
			getGroupActiveStat() {
				this.$u.api
					.getGroupActiveStat()
					.then((res) => {
						if (res.status == 200) {
							this.groupActiveStar = res.result;
						}
					})
					.catch((res) => {
						if (res.errMsg == "request:fail timeout") {
							this.$u.toast("请求超时，请重试!");
						} else if (res.errMsg == "request:fail") {
							this.$u.toast("请求失败，请重试");
						} else {
							this.$u.toast(res.resultDesc);
						}
						this.$loading(false);
						setTimeout(() => {
							this.$u.route({
								type: "navigateBack",
								delta: 1,
							});
						}, 2000);
					});
			},
			// 客服入口跳转
			serviceContentTap() {
				let mobile = uni.getStorageSync("loginInfo").account;
				let customer = {
					姓名: uni.getStorageSync("loginInfo").real_name ?
						uni.getStorageSync("loginInfo").real_name : "盛秘书",
					手机: mobile,
					来源: "盛秘书", // 来源请写自己APP名称
				};
				customer = JSON.stringify(customer);
				let url = encodeURIComponent(
					"http://chat.ahcdialogchat.com/chat/h5/chatLink.html?channelId=3L0fbR&history=true&customer=" +
					customer +
					"&uniqueId=" +
					mobile
				);
				uni.navigateTo({
					url: "/pages/serviceCenter/serviceCenter?url=" + url,
				});
			},
			//5.四舍五入保留2位小数（不够位数，则用0替补）
			keepTwoDecimalFull(num) {
				var result = parseFloat(num);
				if (isNaN(result)) {
					alert("传递参数错误，请检查！");
					return false;
				}
				result = Math.round(num * 100) / 100;
				var s_x = result.toString(); //将数字转换为字符串

				var pos_decimal = s_x.indexOf("."); //小数点的索引值

				// 当整数时，pos_decimal=-1 自动补0
				if (pos_decimal < 0) {
					pos_decimal = s_x.length;
					s_x += ".";
				}

				// 当数字的长度< 小数点索引+2时，补0
				while (s_x.length <= pos_decimal + 2) {
					s_x += "0";
				}
				this.userInfo.month_trade = s_x;
				return s_x;
			},
			//页面跳转
			jumpTap(url, type = "navigateTo") {
				let isAuth = uni.getStorageSync("loginInfo").isCert;
				if (isAuth == 1) {
					this.$u.route({
						url: url,
						type: type,
					});
				} else {
					this.$refs.uToast.show({
						title: "请先进行实名认证",
						type: "error",
						url: "/pages/mine/authName",
					});
				}
			},
		},
	};
</script>
<style lang="scss">
	page {
		background: #fff;
	}

	.indexBox {
		background: #fff url("../../static/images/indexHeaderBg.jpg") no-repeat;
		background-size: 100% auto;
	}

	.indexBannerBtnMain {
		padding: 0 24rpx;
		box-shadow: 0 0 10rpx #eee;

		.indexBannerBtnBox {
			padding: 24rpx 10rpx;

			image {
				width: 100%;
				vertical-align: middle;
			}
		}
	}

	.indexNoticeMain {
		box-shadow: 0 0 10rpx #eee;
	}

	.indexMenuMain {
		padding: 20rpx 29rpx 40rpx;

		.indexMenuBox {
			padding: 0;

			.indexMenuItem {
				width: 25%;
				float: left;
				text-align: center;
				position: relative;

				.tip {
					position: absolute;
					top: 20rpx;
					right: 20rpx;
					font-size: 24rpx;
					background: #fb4535;
					color: #fff;
					width: 76rpx;
					height: 36rpx;
					line-height: 36rpx;
					border-radius: 60rpx;
					transform: scale(0.8);
				}

				image {
					width: 93rpx;
					height: 93rpx;
					vertical-align: middle;
					margin-top: 30rpx;
				}

				text {
					font-size: 26rpx;
					color: #000;
					display: block;
					line-height: 70rpx;
				}
			}
		}
	}

	.indexIncomeMain {
		padding: 196rpx 30rpx 0;
		position: relative;

		.headerBtnBox {
			position: absolute;
			left: 0;
			top: 76rpx;
			height: 88rpx;
			color: #fff;
			width: 100%;
			letter-spacing: 3rpx;
			justify-content: space-around;

			.titleContet {

				& text:first-child {
					font-size: 60rpx;
				}

				& text:last-child {
					font-size: 26rpx;
					padding-left: 25rpx;
				}
			}

			.imageBox {
				margin-left: 90rpx;

				image {
					width: 48rpx;
					height: 48rpx;
				}

				& image:first-child {
					margin-right: 30rpx;
				}
			}

		}

		.indexIncomeBox {
			position: relative;
			background: #fff;
			border-radius: 10rpx;
			box-shadow: 0 6rpx 30rpx #fdccc9;
			padding-bottom: 30rpx;
			text-align: center;
			color: #000;

			.left {
				padding-top: 48rpx;

				text {
					display: block;

					&:nth-of-type(1) {
						font-size: 26rpx;
						font-weight: 700;
						letter-spacing: 2rpx;
					}

					&:nth-of-type(2) {
						font-size: 60rpx;
						font-family: "numberFont";
						color: #FB4635;
						padding-top: 6rpx;
					}
				}
			}

			.right {
				position: absolute;
				right: 0;
				top: 38rpx;
				padding: 10rpx 0rpx 10rpx 24rpx;
				text-align: center;
				font-size: 26rpx;
				color: #fff;
				background-image: linear-gradient(to right, #ff7366 0%, #fb4535 100%);
				border-top-left-radius: 40rpx;
				border-bottom-left-radius: 40rpx;

				image {
					width: 11rpx;
					height: 11rpx;
					margin: 0 16rpx 0 11rpx;
				}
			}

			.sub {
				padding-top: 36rpx;

				.item {
					position: relative;
					width: 100%;
					// &:nth-of-type(1)::before {
					// 	content: "";
					// 	display: block;
					// 	width: 2rpx;
					// 	height: 60rpx;
					// 	background: #e0e0e0;
					// 	position: absolute;
					// 	right: -1rpx;
					// 	top: 50%;
					// 	margin-top: -30rpx;
					// }

					text {
						display: block;
						text-align: center;

						&:nth-of-type(1) {
							font-size: 26rpx;
							color: #666;
						}

						&:nth-of-type(2) {
							font-size: 40rpx;
							color: #000;
							letter-spacing: 2rpx;
							font-family: "numberFont";
							padding-top: 10rpx;
						}
					}
				}
			}
		}
	}

	.dataPart {
		padding: 0 30rpx 30rpx;

		.dataBox {
			background-color: #fff;
			box-shadow: 0rpx 0rpx 8rpx #dedede;
			border-radius: 10rpx;

			.topText {
				padding: 40rpx 0 34rpx 30rpx;

				image {
					width: 28rpx;
					height: 28rpx;
				}

				text {
					padding-left: 16rpx;
					font-size: 34rpx;
					color: #000;
					font-weight: 700;
					letter-spacing: 2rpx;
				}
			}

			.chooseItem {
				padding-left: 30rpx;

				view {
					float: left;
					border: 1rpx solid #fb4535;
					padding: 8rpx 16rpx;
					border-radius: 30rpx;
					font-size: 24rpx;
					color: #fff;
					background-color: #fb4535;
					transition: 0.6s;
				}

				& view:last-child {
					margin-left: 30rpx;
				}

				.unActive {
					color: #999;
					background-color: #fff;
					border: 1rpx solid #999;
					transition: 0.6s;
				}
			}

			.dataShow {
				margin-top: 94rpx;
				display: flex;
				justify-content: space-around;

				&>view {
					width: 50%;
					flex-direction: column;
					text-align: center;
					height: 112rpx;

					& view:first-child {
						font-size: 24rpx;
						color: #999;
					}

					& view:last-child {
						font-family: numberFont;
						font-size: 40rpx;
						color: #000;
						font-weight: bold;
						letter-spacing: 3rpx;
						padding-top: 14rpx;
					}
				}
			}
		}

		.totleData {
			margin-top: 14rpx;
			border-top: 1rpx solid #eee;
			height: 87rpx;
			padding-left: 30rpx;
			font-size: 24rpx;
			color: #000000;
			letter-spacing: 1rpx;

			text {
				font-size: 40rpx;
				font-family: numberFont;
				color: #fb4535;
			}
		}
	}
</style>
